import React, {useState} from 'react';
import {Button, Modal, Text, TextInput, View} from 'react-native';
import mystyles from './mystyles';

const InputModal = ({visible, onCancel, onOk, defaultText}) => {
  const [inputText, setInputText] = useState(defaultText);
  //console.log('inputText -> ', inputText);
  if (!defaultText) {
    // setInputText(defaultText);
    defaultText = '输入内容';
  }
  const handleOk = () => {
    onOk(inputText);
    //setInputText('');
  };

  return (
    <Modal visible={visible} animationType="slide">
      <View style={mystyles.container}>
        <Text style={mystyles.SubTitle}>输入文字:</Text>
        <TextInput
          style={{borderWidth: 1, borderColor: '#BBBBFF', margin: 2}}
          placeholder={defaultText}
          value={inputText}
          onChangeText={setInputText}
        />
        <View style={mystyles.rowcontainer}>
          <View style={{width: '50%', margin: 3}}>
            <Button title="确认" onPress={handleOk} />
          </View>
          <View style={{width: '50%', margin: 3}}>
            <Button title="取消" onPress={onCancel} />
          </View>
        </View>
      </View>
    </Modal>
  );
};

export default InputModal;
